<!--
* @description  : 案件-运输信息
* @descriptionDetail: 案件-运输信息
* @copyright    : 浙江烟草
* @author       : wn
* @create       : 2022-07-10 16:15:38
-->
<template>
  <view class="page">
    <!-- #ifdef H5-ONLY -->
    <theme-navbar :isWhite="true" backText="返回" :title="typeInfo.typeName"></theme-navbar>
    <!-- #endif -->
    <view class="content">
      <u-form :model="transportForm" :rules="rules" :errorType="errorType" ref="uForm">
        <view class="info-content">
          <view style="width: calc(100% - 30px);">
            <form-section title="运输信息" iconColorClass="u-warning"></form-section>
          </view>
          <view class="info-box">
            <u-form-item label="运输类型" prop="logisticsType" :label-position="labelPosition">
              <dic-input
                :keyWord="$u.dic.DIC_KEYS.C_LOGISTICS_TYPE"
                :dicCode="transportForm.logisticsType"
                :disabled="isDisabled"
                :border="border"
                type="select"
                :select-open="dicSelectOpen('logi',$u.dic.DIC_KEYS.C_LOGISTICS_TYPE)"
                placeholder="请选择"
                v-model="transportForm.logisticsName"
                @changeInputModelData="(name)=>{$set(transportForm, 'logisticsName', name)}"
                @click="!justView && showDic($u.dic.DIC_KEYS.C_LOGISTICS_TYPE,transportForm.logisticsType,'logi')"
              />
            </u-form-item>
            <u-form-item label="是否为运输案件" prop="isTransport" label-width="220" label-position="left">
              <view class="u-sub-btn" slot="right">
                <u-switch
                  :disabled="disable || justView"
                  size="40"
                  active-value="1"
                  inactive-value="0"
                  v-model="transChecked"
                  @change="switchChange($event,'isTransport','transChecked')"
                ></u-switch>
              </view>
            </u-form-item>
            <u-form-item label="运输案发地" prop="transportAddr" :required="true" :label-position="labelPosition" v-if="transChecked">
              <dic-input :keyWord="$u.dic.DIC_KEYS.C_TRANSPORT_ADDR" :dicCode="transportForm.transportAddr" :disabled="isDisabled" :border="border" type="select" :select-open="dicSelectOpen('addr',$u.dic.DIC_KEYS.C_TRANSPORT_ADDR)" placeholder="请选择" v-model="transportForm.tranSportAddrName" @changeInputModelData="(name)=>{$set(transportForm, 'tranSportAddrName', name)}" @click="!justView && showDic($u.dic.DIC_KEYS.C_TRANSPORT_ADDR,transportForm.transportAddr,'addr')" />
            </u-form-item>
            <u-form-item label="运输方式" prop="transportStyle" :required="true" :label-position="labelPosition" v-if="transChecked">
              <dic-input
                :disabled="isDisabled"
                :keyWord="$u.dic.DIC_KEYS.C_TRANSPORT_STYLE"
                :dicCode="transportForm.transportStyle"
                :border="border"
                type="select"
                :select-open="dicMultiSelectOpen('style',$u.dic.DIC_KEYS.C_TRANSPORT_STYLE)"
                placeholder="请选择"
                v-model="transportForm.tranSportStyleName"
                @changeInputModelData="(name)=>{$set(transportForm, 'tranSportStyleName', name)}"
                @click="!justView && showMultiDic($u.dic.DIC_KEYS.C_TRANSPORT_STYLE,transportForm.transportStyle,'style')"
              />
            </u-form-item>
          </view>
        </view>
        <view v-if="transChecked">
          <!-- 物流公司 -->
          <view class="info-content">
            <view class="info-title">
              <view style="width: calc(100% - 30px);">
                <form-section title="物流公司"></form-section>
              </view>
              <view>
                <u-icon name="plus-circle" :color="$theme.u_type_primary" size="48" v-if="!justView" @click="addOrEditInfo('deliver','add')"></u-icon>
              </view>
            </view>
            <u-swipe-action
              :show="deliItem.show"
              :index="index"
              :options="newOptions"
              :disabled="justView"
              v-for="(deliItem,index) in deliveryList"
              :key="index"
              @click="deliverClick"
              @open="deliverOpen"
            >
              <view class="step-lay1-content" style="margin-bottom: 10rpx;">
                <view class="step-lay1-content-left">
                  <view>
                    <view style="display: flex;flex-direction: row;">
                      <text>{{ deliItem.name }}</text>
                    </view>
                    <view class="step-lay1-content-left-card">
                      {{ deliItem.orgName }}
                    </view>
                  </view>
                </view>
              </view>
            </u-swipe-action>
          </view>
          <!-- 快递公司 -->
          <view class="info-content">
            <view class="info-title">
              <view style="width: calc(100% - 30px);">
                <form-section title="快递公司"></form-section>
              </view>
              <view>
                <u-icon name="plus-circle" :color="$theme.u_type_primary" size="48" v-if="!justView" @click="addOrEditInfo('express','add')"></u-icon>
              </view>
            </view>
            <u-swipe-action
              :show="deliItem.show"
              :index="index"
              :options="newOptions"
              :disabled="justView"
              v-for="(deliItem,index) in expressList"
              :key="index"
              @click="expressClick"
              @open="expressOpen"
            >
              <view class="step-lay1-content" style="margin-bottom: 10rpx;">
                <view class="step-lay1-content-left">
                  <view>
                    <view style="display: flex;flex-direction: row;">
                      <text>{{ deliItem.expressCompanyName }}</text>
                    </view>
                    <view class="step-lay1-content-left-card">
                      {{ deliItem.orgName }}
                    </view>
                  </view>
                </view>
              </view>
            </u-swipe-action>
          </view>
          <!-- 面单信息 -->
          <view class="info-content">
            <view class="info-title">
              <view style="width: calc(100% - 30px);">
                <form-section title="面单信息"></form-section>
              </view>
              <view>
                <u-icon name="plus-circle" :color="$theme.u_type_primary" size="48" v-if="!justView" @click="addOrEditInfo('faceOrder','add')"></u-icon>
              </view>
            </view>
            <u-swipe-action
              :show="deliItem.show"
              :index="index"
              :options="newOptions"
              :disabled="justView"
              v-for="(deliItem,index) in faceOrderList"
              :key="index"
              @click="faceOrderClick"
              @open="faceOrderOpen"
            >
              <view class="step-lay1-content" style="margin-bottom: 10rpx;">
                <view class="step-lay1-content-left">
                  <view>
                    <view style="display: flex;flex-direction: row;">
                      <text>{{ deliItem.billCode }}</text>
                    </view>
                    <view class="step-lay1-content-left-card">
                      {{ deliItem.expressName }}
                    </view>
                  </view>
                </view>
              </view>
            </u-swipe-action>
          </view>
          <view class="info-content">
            <view class="info-title">
              <view style="width: calc(100% - 30px);">
                <form-section title="水路运输"></form-section>
              </view>
              <view>
                <u-icon name="plus-circle" :color="$theme.u_type_primary" size="48" v-if="!justView" @click="addOrEditInfo('water','add')"></u-icon>
              </view>
            </view>
            <u-swipe-action
              :show="WaterItem.show"
              :index="index"
              :options="newOptions"
              :disabled="justView"
              v-for="(WaterItem,index) in involvedWaterList"
              :key="index"
              @click="waterClick"
              @open="waterOpen"
            >
              <view class="step-lay1-content" style="margin-bottom: 10rpx;">
                <view class="step-lay1-content-left">
                  <view>
                    <view style="display: flex;flex-direction: row;">
                      <text>{{ WaterItem.serviceName }}</text>
                    </view>
                    <view class="step-lay1-content-left-card">
                      {{ WaterItem.orgName }}
                    </view>
                  </view>
                </view>
              </view>
            </u-swipe-action>
          </view>

          <view class="info-content">
            <view class="info-title">
              <view style="width: calc(100% - 30px);">
                <form-section title="航空运输"></form-section>
              </view>
              <view>
                <u-icon name="plus-circle" :color="$theme.u_type_primary" size="48" v-if="!justView" @click="addOrEditInfo('aviation','add')"></u-icon>
              </view>
            </view>
            <u-swipe-action
              :show="AviationItem.show"
              :index="index"
              :options="newOptions"
              :disabled="justView"
              v-for="(AviationItem,index) in involvedAviationList"
              :key="index"
              @click="aviationClick"
              @open="aviationOpen"
            >
              <view class="step-lay1-content" style="margin-bottom: 10rpx;">
                <view class="step-lay1-content-left">
                  <view>
                    <view style="display: flex;flex-direction: row;">
                      <text>{{ AviationItem.serviceName }}</text>
                    </view>
                    <view class="step-lay1-content-left-card">
                      {{ AviationItem.orgName }}
                    </view>
                  </view>
                </view>
              </view>
            </u-swipe-action>
          </view>

          <view class="info-content">
            <view class="info-title">
              <view style="width: calc(100% - 30px);">
                <form-section title="铁路运输"></form-section>
              </view>
              <view>
                <u-icon name="plus-circle" :color="$theme.u_type_primary" size="48" v-if="!justView" @click="addOrEditInfo('railway','add')"></u-icon>
              </view>
            </view>
            <u-swipe-action
              :show="RailwayItem.show"
              :index="index"
              :options="newOptions"
              :disabled="justView"
              v-for="(RailwayItem,index) in involvedRailwayList"
              :key="index"
              @click="railwayClick"
              @open="railwayOpen"
            >
              <view class="step-lay1-content" style="margin-bottom: 10rpx;">
                <view class="step-lay1-content-left">
                  <view>
                    <view style="display: flex;flex-direction: row;">
                      <text>{{ RailwayItem.serviceName }}</text>
                    </view>
                    <view class="step-lay1-content-left-card">
                      {{ RailwayItem.orgName }}
                    </view>
                  </view>
                </view>
              </view>
            </u-swipe-action>
          </view>

          <view class="info-content">
            <view class="info-title">
              <view style="width: calc(100% - 30px);">
                <form-section title="涉案车辆"></form-section>
              </view>
              <view>
                <u-icon name="plus-circle" :color="$theme.u_type_primary" size="48" v-if="!justView" @click="addOrEditInfo('car','add')"></u-icon>
              </view>
            </view>
            <u-swipe-action
              :show="carItem.show"
              :index="index"
              :options="newOptions"
              :disabled="justView"
              v-for="(carItem,index) in involvedCarList"
              :key="index"
              @click="carClick"
              @open="carOpen"
            >
              <view class="step-lay1-content" style="margin-bottom: 10rpx;">
                <view class="step-lay1-content-left">
                  <view>
                    <view style="display: flex;flex-direction: row;">
                      <text>{{ carItem.carNum }}</text>
                    </view>
                    <view class="step-lay1-content-left-card">
                      {{ carItem.carColorName }}，{{ carItem.carStyleName }}
                    </view>
                  </view>
                </view>
              </view>
            </u-swipe-action>
          </view>

          <view class="info-content">
            <view class="info-title">
              <view style="width: calc(100% - 30px);">
                <form-section title="物流中转站"></form-section>
              </view>
              <view>
                <u-icon name="plus-circle" :color="$theme.u_type_primary" size="48" v-if="!justView" @click="addOrEditInfo('trans','add')"></u-icon>
              </view>
            </view>
            <u-swipe-action
              :show="logiItem.show"
              :index="index"
              :options="newOptions"
              :disabled="justView"
              v-for="(logiItem,index) in logiTransList"
              :key="index"
              @click="transClick"
              @open="transOpen"
            >
              <view class="step-lay1-content" style="margin-bottom: 10rpx;">
                <view class="step-lay1-content-left">
                  <view>
                    <view style="display: flex;flex-direction: row;">
                      <text>{{ logiItem.logiName }}</text>
                    </view>
                    <view class="step-lay1-content-left-card">
                      {{ logiItem.address }}
                    </view>
                  </view>
                </view>
              </view>
            </u-swipe-action>
          </view>
        </view>
      </u-form>
      <view class="space-content"></view>
      <view class="submit-btns btn-other-cls">
        <u-button class="u-btn" type="primary" v-if="!justView" @click="saveHandle">
          保存
        </u-button>
      </view>
    </view>

    <dic-choice :keyWord="dicKeyWords" :currentSelect="dicCurrentSelect" v-model="dicShow" @confirm="selectDicConfirm"></dic-choice>
    <!-- 多选字典组件 -->
    <u-popup mode="bottom" height="50%" v-model="mulitChoiceShow">
      <dic-multi-choice
        :otherLogic="true"
        :logicFun="logicFun"
        :keyWord="dicKeyWords"
        :defaultUids="dicCurrentSelect"
        @select="multiChoiceConfirm"
      >
      </dic-multi-choice>
    </u-popup>
  </view>
</template>

<script>
import DicChoice from "@/components/dic_choice.vue";
import DicInput from "@/components/dic_input.vue";
import common from "@/components/commonMixins.js";
import {SwiperEditAndDel,SwiperView,GET_NODE,LOGISTICS_TYPE,} from "@/service/case/mapping/index.js";
import caseService from '@/service/case/case.service.js';
import FormSection from "@/components/form-section.vue";
import DicMultiChoice from "@/components/dic_multi_choice.vue";
export default{
  components:{
    "dic-choice":DicChoice,
    "dic-input":DicInput,
    FormSection,
    DicMultiChoice,
  },
  mixins: [common,],
  data() {
    return {
      GET_NODE,
      LOGISTICS_TYPE,
      SwiperEditAndDel,
      SwiperView,
      formItem:{},
      transportForm:{
        marketName:'',
        transportStyle:"",
      },
      // rules:{},
      aIndex:0,
      isTrue:true,
      errorType: ['border-bottom','message',],
      labelPosition:"top",
      border: false,
      typeInfo:{},
      caseCode:'',
      caseUuid:'',
      isDisabled:false,// 是否禁用
      transChecked:false,
      deliChecked:false,
      activeColor: this.$u.color['primary'],
      isSwitchDis:false,// switch是否禁用
      disable:false,
      newOptions:[],
      dicType:"",
      mulitChoiceShow: false, // 多选弹出框show
      dicShow: false, // dic_select 是否显示
      dicKeyWords: "", // dic 关键字
      dicCurrentSelect: "", // dic 当前选择项
      involvedWaterList:[],// 水路运输信息
      involvedAviationList:[],// 航空运输信息
      involvedRailwayList:[],// 铁路运输信息

      involvedCarList:[],// 涉案车辆信息
      logiTransList:[],// 物流中转信息
      deliveryList:[],// 物流公司信息
      expressList:[], // 快递公司信息
      faceOrderList:[], // 面单公司信息
      justView:false,
      toRoute:{
        water:'pages/case/caseInfoTemp/involved/involvedWaterway',
        aviation:'pages/case/caseInfoTemp/involved/involvedAviation',
        railway:'pages/case/caseInfoTemp/involved/involvedRailway',
        car:'pages/case/caseInfoTemp/involvedCar',
        trans:'pages/case/caseInfoTemp/logiTransInfo',
        deliver:'pages/case/caseInfoTemp/deliveryInfo',
        express:'pages/case/caseInfoTemp/expressInfo',
        faceOrder:'pages/case/caseInfoTemp/faceOrderInfo',
      },
      caseCarList:[],
      idList:['1','2','3','27',],
      rules:{
        transportAddr: [{
          required: true,
          message: '请选择运输案发地',
          // 可以单个或者同时写两个触发验证方式
          trigger: ['change', 'blur',],
        },
        ],
        transportStyle: [{
          required: true,
          message: '请选择运输方式',
          // 可以单个或者同时写两个触发验证方式
          trigger: ['change', 'blur',],
        },
        ],},
    }
  },
  watch: {
    involvedCarList(newValue) {
      let self = this;
      if(newValue){
        newValue.filter(item => {
          if(item){
            self.$set(item, 'show', false);
            return true;
          }else{
            return false;
          }
        });
      }
    },
    involvedWaterList(newValue) {
      let self = this;
      if(newValue){
        newValue.filter(item => {
          if(item){
            self.$set(item, 'show', false);
            return true;
          }else{
            return false;
          }
        });
      }
    },
    involvedAviationList(newValue) {
      let self = this;
      if(newValue){
        newValue.filter(item => {
          if(item){
            self.$set(item, 'show', false);
            return true;
          }else{
            return false;
          }
        });
      }
    },
    involvedRailwayList(newValue) {
      let self = this;
      if(newValue){
        newValue.filter(item => {
          if(item){
            self.$set(item, 'show', false);
            return true;
          }else{
            return false;
          }
        });
      }
    },
    logiTransList(newValue) {
      let self = this;
      if(newValue){
        newValue.filter(item => {
          if(item){
            self.$set(item, 'show', false);
            return true;
          }else{
            return false;
          }
        });
      }
    },
    deliveryList(newValue) {
      let self = this;
      if(newValue){
        newValue.filter(item => {
          self.$set(item, 'show', false);
          return true;
        });
      }
    },
    expressList(newValue) {
      let self = this;
      if(newValue){
        newValue.filter(item => {
          self.$set(item, 'show', false);
          return true;
        });
      }
    },
    faceOrderList(newValue) {
      let self = this;
      if(newValue){
        newValue.filter(item => {
          self.$set(item, 'show', false);
          return true;
        });
      }
    },
  },
  mounted() {
    this.initData();
  },
  onReady(){
    this.$refs.uForm.setRules(this.rules);
  },
  // 加载初始周期方法
  onLoad() {
    let preParams = this.getRouteParam();
    this.caseCarList = preParams.obj.casePropertyRelList
    this.caseCode = preParams.obj.caseCode;
    this.caseUuid = preParams.obj.caseUuid;

    if(preParams.obj.transChecked && preParams.obj.getNode.indexOf(GET_NODE.TRANSPORT) == -1){
      this.transChecked = preParams.obj.transChecked;
    }else{
      if(preParams.obj.getNode.indexOf(GET_NODE.TRANSPORT) != -1 ||  preParams.obj.isTransport){
        this.disable = true;
        this.transChecked = preParams.obj.isTransport;
      }else{
        this.disable = false;
        this.transChecked = false;
      }
    }
    if (preParams.type) {
      this.typeInfo.type = preParams.type;
      this.typeInfo.typeName = preParams.type == 'add' ? "添加运输" :  "运输信息";
      this.justView = preParams.type == 'view';
      this.newOptions = this.SwiperEditAndDel;
      preParams.obj.logisticsType = preParams.obj.logisticsType && String(preParams.obj.logisticsType);
      this.objMerge(this.transportForm, preParams.obj);
      // this.transChecked = preParams.obj.isTransport;
      this.deliChecked = preParams.obj.isDelivery;
      // this.initData();
    } else {
      this.typeInfo = {};
    }
    if (preParams.choseType && preParams.choseType === 'caseMap') {
      this.justView = true
    }
  },
  methods: {
    // 编辑初始化页面数据
    initData(){

      // 获取列表数据
      this.getListData('getCaseLogiTransList','logiTransList');
      // this.getListData('getCaseCourierOrderList','deliveryList');
      this.getListData('queryLogisticsList','deliveryList');
      this.getListData('queryExpressList','expressList');
      this.getListData('queryfaceOrderList','faceOrderList');
      this.getListData('getCaseCarInfoList','involvedCarList');

      this.getListData('queryListShip','involvedWaterList');
      this.getListData('queryListPlane','involvedAviationList');
      this.getListData('queryListTrain','involvedRailwayList');
    },
    dicSelectOpen: function (type,keyWords) {
      if (this.isDisabled) return;
      if(type == this.dicType){
        if (this.dicKeyWords == keyWords && this.dicShow) {
          return true;
        }
        return false;
      }
    },
    showDic: function (key, cur,type) {
      if (this.dicShow) return;
      this.dicKeyWords = key;
      this.dicCurrentSelect = cur;
      this.dicShow = true;
      this.dicType = type;
    },
    selectDicConfirm: function (e) {
      // 类型
      if(this.dicKeyWords == this.$u.dic.DIC_KEYS.C_TRANSPORT_ADDR){
        this.transportForm.tranSportAddrName = e[0].label;
        this.transportForm.transportAddr = e[0].extra.bcbCode;
      }else if(this.dicKeyWords == this.$u.dic.DIC_KEYS.C_TRANSPORT_STYLE){
        this.transportForm.tranSportStyleName = e[0].label;
        this.transportForm.transportStyle = e[0].extra.bcbCode;
      }else if(this.dicKeyWords == this.$u.dic.DIC_KEYS.C_LOGISTICS_TYPE){
        this.transportForm.logisticsName = e[0].label;
        this.transportForm.logisticsType = e[0].extra.bcbCode;
      }
    },
    // 群体类型互斥逻辑函数
    logicFun(item, selectedItems) {
      selectedItems.push(item);
      return selectedItems;
    },
    // 群体类型多选
    dicMultiSelectOpen(type, keyWords) {
      if (this.isDisabled) return;
      if (type == this.dicType) {
        if (this.dicKeyWords == keyWords && this.mulitChoiceShow) {
          return true;
        }
        return false;
      }
    },
    showMultiDic(key, cur, type) {
      if (this.isDisable) return
      if (this.mulitChoiceShow) return;
      this.dicKeyWords = key;
      this.dicCurrentSelect = cur;
      this.mulitChoiceShow = true;
      this.dicType = type;
    },
    // 群体类型所选确认按钮
    multiChoiceConfirm(e) {
      this.mulitChoiceShow = false;
      let labels = [];
      let codes = [];
      e.forEach(itm => {
        labels.push(itm.bcbName);
        codes.push(itm.bcbCode);
      });
      this.transportForm.tranSportStyleName = labels.join(',');
      this.transportForm.transportStyle = codes.join(',');
    },
    // switch切换
    switchChange(status,type,isCheck){
      this.isDisabled = status == '0' ? true : false;
      this[isCheck] = status == '0' ? false : true;
      this.transportForm[type] = status == '0' ? 'false' : 'true';
      if(status == '0' && type === 'isTransport'){
        this.transportForm.tranSportAddrName = '';
        this.transportForm.tranSportStyleName = '';
      }
    },
    // 涉案车辆、物流中转编辑新增
    addOrEditInfo(flag,type,obj){
      let complaint = {
        type:type,
        caseCode:this.caseCode,
        caseUuid:this.caseUuid,
      };
      if(obj){
        complaint.param = obj;
      }
      this.setRouteParam(complaint);
      this.$u.route(this.toRoute[flag]);
    },
    // 刷新滑动块
    refreshSwiperCar(){
      let self = this;
      this.involvedCarList = this.involvedCarList.filter(item => {
        self.$set(item, 'show', false);
        return true;
      });

    },
    // 刷新滑动块
    refreshSwiperWater(){
      let self = this;
      this.involvedWaterList = this.involvedWaterList.filter(item => {
        self.$set(item, 'show', false);
        return true;
      });

    },
    // 刷新滑动块
    refreshSwiperAviation(){
      let self = this;
      this.involvedAviationList = this.involvedAviationList.filter(item => {
        self.$set(item, 'show', false);
        return true;
      });
    },
    // 铁路刷新滑动块
    refreshSwiperRailway(){
      let self = this;
      this.involvedRailwayList = this.involvedRailwayList.filter(item => {
        self.$set(item, 'show', false);
        return true;
      });
    },
    refreshSwiperTrans(){
      let self = this;
      this.logiTransList = this.logiTransList.filter(item => {
        self.$set(item, 'show', false);
        return true;
      });
    },
    refreshSwiperDeliver(){
      let self = this;
      this.deliveryList = this.deliveryList.filter(item => {
        self.$set(item, 'show', false);
        return true;
      });
    },
    refreshSwiperExpress(){
      let self = this;
      this.expressList = this.expressList.filter(item => {
        self.$set(item, 'show', false);
        return true;
      });
    },
    refreshSwiperFace(){
      let self = this;
      this.faceOrderList = this.faceOrderList.filter(item => {
        self.$set(item, 'show', false);
        return true;
      });
    },
    // 物流公司滑动操作
    deliverClick(index,index1){
      if(index1 == 1) {
        let delLogiList = this.deliveryList;
        this.$modal.confirm('确定要删除吗?',() => {
          caseService.delLogisticsById(delLogiList[index].uuid).then(res => {
            res.success &&  this.getListData('queryLogisticsList','deliveryList');
          }).catch(err => {
            this.$u.toast(err);
          });
        });
      } else {
        this.deliveryList[index].show = false;
        this.addOrEditInfo('deliver','edit',this.deliveryList[index]);
      }
      this.refreshSwiperDeliver();
    },
    deliverOpen(index){
      this.deliveryList[index].show = true;
      this.deliveryList.map((val, idx) => {
        if(index != idx) this.deliveryList[idx].show = false;
      });
    },
    // 快递公司滑动操作
    expressClick(index,index1){
      if(index1 == 1) {
        let delLogiList = this.expressList;
        this.$modal.confirm('确定要删除吗?',() => {
          caseService.delExpressById(delLogiList[index].uuid).then(res => {
            res.success &&  this.getListData('queryExpressList','expressList');
          }).catch(err => {
            this.$u.toast(err);
          });
        });
      } else {
        this.expressList[index].show = false;
        this.addOrEditInfo('express','edit',this.expressList[index]);
      }
      this.refreshSwiperExpress();
    },
    expressOpen(index){
      this.expressList[index].show = true;
      this.expressList.map((val, idx) => {
        if(index != idx) this.expressList[idx].show = false;
      });
    },
    // 面单公司滑动操作
    faceOrderClick(index,index1){
      if(index1 == 1) {
        let delLogiList = this.faceOrderList;
        this.$modal.confirm('确定要删除吗?',() => {
          caseService.delFaceById(delLogiList[index].uuid).then(res => {
            res.success &&  this.getListData('queryfaceOrderList','faceOrderList');
          }).catch(err => {
            this.$u.toast(err);
          });
        });
      } else {
        this.faceOrderList[index].show = false;
        this.addOrEditInfo('faceOrder','edit',this.faceOrderList[index]);
      }
      this.refreshSwiperFace();
    },
    faceOrderOpen(index){
      this.faceOrderList[index].show = true;
      this.faceOrderList.map((val, idx) => {
        if(index != idx) this.faceOrderList[idx].show = false;
      });
    },
    // 涉案车辆滑动操作
    carClick(index,index1){
      if(index1 == 1) {
        let delLogiList = this.involvedCarList;
        this.$modal.confirm('确定要删除吗?',() => {
          caseService.delCar({carUuid:delLogiList[index].carUuid,}).then(res => {
            res.success &&  this.getListData('getCaseCarInfoList','involvedCarList');
          }).catch(err => {
            this.$u.toast(err);
          });
        });
      } else {
        this.involvedCarList[index].show = false;
        this.addOrEditInfo('car','edit' ,this.involvedCarList[index]);
      }
      this.refreshSwiperCar();
    },
    // 水路运输滑动操作
    waterClick(index,index1){
      if(index1 == 1) {
        let delLogiList = this.involvedWaterList;
        this.$modal.confirm('确定要删除吗?',() => {
          caseService.deleteById({id:delLogiList[index].uuid,__t: '1661911968226',}).then(res => {
            res.success &&  this.getListData('queryListShip','involvedWaterList');
          }).catch(err => {
            this.$u.toast(err);
          });
        });
      } else {
        this.involvedWaterList[index].show = false;
        this.addOrEditInfo('water','edit' ,this.involvedWaterList[index]);
      }
      this.refreshSwiperWater();
    },
    // 航空运输滑动操作
    aviationClick(index,index1){
      if(index1 == 1) {
        let delLogiList = this.involvedAviationList;
        this.$modal.confirm('确定要删除吗?',() => {
          caseService.deleteByIdPlane({id:delLogiList[index].uuid,__t: '1661911968228',}).then(res => {
            res.success &&  this.getListData('queryListPlane','involvedAviationList');
          }).catch(err => {
            this.$u.toast(err);
          });
        });
      } else {
        this.involvedAviationList[index].show = false;
        this.addOrEditInfo('aviation','edit' ,this.involvedAviationList[index]);
      }
      this.refreshSwiperAviation();
    },
    railwayClick(index,index1){
      if(index1 == 1) {
        let delLogiList = this.involvedRailwayList;
        this.$modal.confirm('确定要删除吗?',() => {
          caseService.deleteByIdTrain({id:delLogiList[index].uuid,__t: '1661911968228',}).then(res => {
            res.success &&  this.getListData('queryListTrain','involvedRailwayList');
          }).catch(err => {
            this.$u.toast(err);
          });
        })
      } else {
        this.involvedRailwayList[index].show = false;
        this.addOrEditInfo('railway','edit' ,this.involvedRailwayList[index]);
      }
      this.refreshSwiperRailway();
    },
    carOpen(index){
      this.involvedCarList[index].show = true;
      this.involvedCarList.map((val, idx) => {
        if(index != idx) this.involvedCarList[idx].show = false;
      });
    },
    waterOpen(index){
      this.involvedWaterList[index].show = true;
      this.involvedWaterList.map((val, idx) => {
        if(index != idx) this.involvedWaterList[idx].show = false;
      });
    },
    aviationOpen(index){
      this.involvedAviationList[index].show = true;
      this.involvedAviationList.map((val, idx) => {
        if(index != idx) this.involvedAviationList[idx].show = false;
      });
    },
    railwayOpen(index){
      this.involvedRailwayList[index].show = true;
      this.involvedRailwayList.map((val, idx) => {
        if(index != idx) this.involvedRailwayList[idx].show = false;
      });
    },
    // 物流中转滑动操作
    transClick(index,index1){
      if(index1 == 1) {
        let delLogiList = this.logiTransList;
        this.$modal.confirm('确定要删除吗?',() => {
          caseService.delLogi({logiUuid:delLogiList[index].logiUuid,}).then(res => {
            res.success &&    this.getListData('getCaseLogiTransList','logiTransList');
          }).catch(err => {
            this.$u.toast(err);
          });
        })
      } else {
        this.logiTransList[index].show = false;
        this.addOrEditInfo('trans','edit',this.logiTransList[index]);
      }
      this.refreshSwiperTrans();
    },
    transOpen(index){
      this.logiTransList[index].show = true;
      this.logiTransList.map((val, idx) => {
        if(index != idx) this.logiTransList[idx].show = false;
      });
    },
    // 涉案车辆、物流中转站、物流寄递添加、编辑返回操作
    updateBackState(params){
      if(params.formItem.type === 'car'){
        this.refreshSwiperCar();
        let index = this.involvedCarList.indexOf(params.formItem.obj);
        if(index == -1) this.involvedCarList.push(params.formItem.obj);
        this.getListData('getCaseCarInfoList','involvedCarList');
      }else if(params.formItem.type === 'water'){
        this.refreshSwiperWater();
        let index = this.involvedWaterList.indexOf(params.formItem.obj);
        if(index == -1) this.involvedWaterList.push(params.formItem.obj);
        this.getListData('queryListShip','involvedWaterList');
      }else if(params.formItem.type === 'aviation'){
        this.refreshSwiperAviation();
        let index = this.involvedAviationList.indexOf(params.formItem.obj);
        if(index == -1) this.involvedAviationList.push(params.formItem.obj);
        this.getListData('queryListPlane','involvedAviationList');
      }else if(params.formItem.type === 'railway'){
        this.refreshSwiperRailway();
        let index = this.involvedRailwayList.indexOf(params.formItem.obj);
        if(index == -1) this.involvedRailwayList.push(params.formItem.obj);
        this.getListData('queryListTrain','involvedRailwayList');
      }else if(params.formItem.type === 'trans'){
        this.refreshSwiperTrans();
        let index = this.logiTransList.indexOf(params.formItem.obj);
        if(index == -1) this.logiTransList.push(params.formItem.obj);
        this.getListData('getCaseLogiTransList','logiTransList');
      }else if(params.formItem.type === 'deliver'){
        this.refreshSwiperDeliver();
        let index = this.deliveryList.indexOf(params.formItem.obj);
        if(index == -1) this.deliveryList.push(params.formItem.obj);
        this.getListData('queryLogisticsList','deliveryList');
      }else if(params.formItem.type === 'express'){
        this.refreshSwiperExpress();
        let index = this.expressList.indexOf(params.formItem.obj);
        if(index == -1) this.expressList.push(params.formItem.obj);
        this.getListData('queryExpressList','expressList');
      }else if(params.formItem.type === 'faceOrder'){
        this.refreshSwiperFace();
        let index = this.faceOrderList.indexOf(params.formItem.obj);
        if(index == -1) this.faceOrderList.push(params.formItem.obj);
        this.getListData('queryfaceOrderList','faceOrderList');
      }
    },
    // 获取列表数据
    getListData(inter,field,type){
      caseService[inter]({caseUuid: this.caseUuid, limit:1, page: 100, }).then(res => {
        if(res.success){
          this[field] = res.data;
          this.newOptions =  this.SwiperEditAndDel ;
        }else{
          this.$u.toast(res.msg);
        }
      });

    },
    // 保存
    saveHandle(){
      let self = this;
      this.$refs.uForm.validate(valid => {
        if (valid) {
          let logisticsType = this.transportForm.logisticsType; // 运输类型选中
          console.log(this.transportForm.transportStyle);
          let transList = this.transportForm.transportStyle.split(''); // 运输方式选中的数组
          if(this.transChecked && transList.length){
            for (let i = 0; i < transList.length; i++) {
              if(transList[i] == 1 && !this.involvedCarList.length){
                return this.$u.toast("请您完善涉案车辆列表数据!")
              }else if(transList[i] == 2 && !this.involvedRailwayList.length){
                return this.$u.toast("请您完善铁路运输列表数据!")
              }else if(transList[i] == 3 && !this.involvedAviationList.length){
                return this.$u.toast("请您完善航空运输列表数据!")
              }else if(transList[i] == 7 && !this.involvedWaterList.length){
                return this.$u.toast("请您完善水路运输列表数据!")
              }else if(transList[i] == 5 && !this.deliveryList.length){
                return this.$u.toast("请您完善物流运输列表数据!")
              }else if(transList[i] == 6 && !this.expressList.length){
                return this.$u.toast("请您完善快递运输列表数据!")
              }
            }
          }
          if(!this.$u.test.isEmpty(logisticsType)){
            console.log(this.deliveryList.length + '===' + this.faceOrderList.length);
            console.log(logisticsType == this.LOGISTICS_TYPE.LOGISTICS_CASE);
            console.log(!this.deliveryList.length);
            console.log(!this.faceOrderList.length);
            if(logisticsType == this.LOGISTICS_TYPE.LOGISTICS_CASE && (this.deliveryList.length == 0 || this.faceOrderList.length == 0)){
              return this.$u.toast("您当前选择的是物流案件, 物流公司列表数据不能为空!面单信息列表数据不能为空!")
            }else if(logisticsType == this.LOGISTICS_TYPE.DELIVER_CASE && (this.expressList.length == 0 || this.faceOrderList.length == 0)){
              return this.$u.toast("您当前选择的是寄递案件,快递公司列表数据不能为空!面单信息列表数据不能为空!")
            }else if(logisticsType == this.LOGISTICS_TYPE.INVOLVING_CAR_CASE && !this.involvedCarList.length){
              return this.$u.toast("您当前选择的是改装车案件, 涉案车辆列表数据不能为空!")
            }
          }
          self.$u.loading('保存中...');
          caseService.saveCaseBaseInfo({...self.transportForm,transChecked:this.transChecked,}).then(res => {
            this.$u.hideLoading();
            if(res.success){
              this.$u.toast(res.msg);
              self.backPrev({
                paramKey:"baseInfo",
                param: {transChecked:this.transChecked,},
              });
            }else{
              this.$u.toast(res.msg);
            }
          }).catch(err => {
            this.$u.hideLoading();
            this.$u.toast(err);

          })
        }
      });
    },
  },

}
</script>

<style lang="scss" scoped>
@import "../case_common.scss";
.page{ padding:0;}
.content{
	.info-content{
		padding: 10px 16px 16px;
		.info-title{
			display: flex;
			flex-direction: row;
			justify-content: space-between;
			align-items: center;
			.p-title-text{
				font-size: $font_size_1;
				font-weight: bold;
			}
		}
		.zj-photo-content{
			min-height: 80px;
			.photo-item{
				padding: 10px;
			}
		}
	}

	.step-lay1-content{
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		align-items: flex-start;
		margin-top: 30rpx;
		.step-lay1-content-left{
			display: flex;
			flex-direction: row;
			justify-content: flex-start;
			align-items: flex-start;
			view:first-child{
				font-size: .8rem;
				font-weight: 500;
				color: #333333;
				margin-right: 10rpx;
				display: flex;
				flex-direction: column;
				justify-content: flex-start;
			}
			.step-lay1-content-left-tag{
				padding: 3rpx 10rpx;
				border-radius: 20rpx;
				font-size: .6rem;
				color: $u-type-primary;
				margin-left: 10rpx;
				border: 1px solid $u-type-primary;
				background-color: $u-type-primary-light;
			}

		}
		.step-lay1-content-right{
			display: flex;
			flex-direction: row;
			justify-content: flex-end;
			align-items: flex-start;
			view:first-child{
				color: #F19833;
				font-size: .7rem;
			}
			view:last-child{
				color: $u-tips-color;
			}
		}
	}
	.step-lay1-content-left-card{
		font-size: .6rem;
		font-weight: 300 !important;
	}
	.u-sub-btn{
		width: 99%;
	}
}
</style>

